<template>
  <div class="delete-log">
    <!-- <div class="search-content">
      <super-search :search-form="searchForm" :search-item-config="searchItemList" @search="searchHandle"></super-search>
    </div> -->
    <div class="table-content">
      <super-table
        ref="tableRef"
        height="100%"
        :hasCustomField="false"
        v-model:page="searchForm.pageNum"
        v-model:limit="searchForm.pageSize"
        :loading="loading"
        :data="tableData"
        :total="searchForm.total"
        :column="tableColumn"
        @change-page="getData"
      >
      </super-table>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { toRefs, watch } from "vue";
import { tableColumn } from "./data";
import InitHook from "./composables/initHook";
import OperationHook from "./composables/operationHook";
const props = withDefaults(
  defineProps<{
    visible: boolean;
  }>(),
  {}
);
const { visible } = toRefs(props);
const { searchForm, tableData, loading } = InitHook();
const { searchHandle, getData } = OperationHook({ loading, searchForm, tableData });
searchHandle();
watch(
  () => visible.value,
  (v: boolean) => {
    if (v) searchHandle();
  }
);
</script>
<style lang="stylus" scoped>
.delete-log{
    background-color: #fff;
    padding: 12px;
    height: 100%;
    .table-content{
        >.super-search-page{
            height: calc(100vh - 170px);
        }
    }
}
</style>
